<template>
	<view class="footer">
		<view class="footer_nav">
      		<view class="footer_nav_li" @click="jump('/pages/index/index')">
				<view class="footer_nav_img"><image :src="iconList[0][cindex[0]]" alt="" mode="widthFix"></image></view>
				<view class="txt">首页</view>
			</view>
			
			 <view class="footer_nav_li" @click="jump('/pages/dongtai/dongtai')">
				<view class="footer_nav_img"><image  :src="iconList[1][cindex[1]]" alt="" mode="widthFix"></image></view>
				<view class="txt">动态</view>
			</view>
			
			<view class="footer_nav_li" @click="jump('/pages/tixian/tixian')">
				<view class="footer_nav_imgs"><image  :src="iconList[2][cindex[2]]" alt="" mode="widthFix"></image></view>
			</view>
			
			<view class="footer_nav_li" @click="jump('/pages/liuyan/liuyan')">
				<view class="footer_nav_img"><image  :src="iconList[3][cindex[3]]" alt="" mode="widthFix"></image></view>
				<view class="txt">消息</view>
			</view>
			
			<view class="footer_nav_li" @click="jump('/pages/user/personal')">
				<view class="footer_nav_img"><image  :src="iconList[4][cindex[4]]" alt="" mode="widthFix"></image></view>
				<view class="txt">我的</view>
			</view> 
		</view>    
	</view>	
</template>

<script> export default {
    data() {
      return {
		  iconList:[["../../static/images/home-5e6bbfc4.png","../../static/images/home-select-a37eeb1a.png"],
		  ["../../static/images/post-fc8bba7f.png","../../static/images/post-select-7326baa4.png"],
		  ["../../static/images/img_0.png","../../static/images/img_0.png"],
		  ["../../static/images/message-69a9d699.png","../../static/images/message-select-73a0d2fa.png"],
		  ["../../static/images/me-5b90b7e4.png","../../static/images/me-select-61b9e7f5.png"]
		  ],
		  cindex:[0,0,0,0,0]
      }
    },
	props:["currIndex"],
	mounted() {
		console.log(this.currIndex,"sssa")
		this.$set(this.cindex,this.currIndex,1)
	},
    methods: {
		jump(url){
			uni.redirectTo({
				url:url
			})
		},
	},		
  }
</script>

<style>
	.footer{
		width: 100%;
	}
	.footer_nav{
		width: 100%;
		display: flex;
		flex-direction: row;
		justify-content: space-between;
		align-items: center;
		margin: 0 auto;
	}
	.footer_nav .footer_nav_li{
		width: 20%;
		margin: 0 auto;
	}
	.footer_nav_img{
		width:20%;
		margin: 0 auto;
	}
	.footer_nav_img image{
		width: 100%;
	}
	.footer_nav .txt{
		text-align: center;
		/* margin-top: -0.35rem; */
		font-size: 0.6rem;
		color: #999999;
	}
	.footer_nav_imgs{
		width:60%;
		margin: 0.5rem auto;
	}
	.footer_nav_imgs image{
		width: 100%;
	}
	
</style>
